<template>
  <div class="launch-wrapper">
    <common-back :content="title"></common-back>
    <div class="title">{{meeting.meeting_name}}</div>
    <div class="initiator">{{meeting.wechat_name}}</div>
    <div class="coach">{{meeting.instructor_name}}</div>
    <div class="time">{{meeting.createtime}}</div>
    <div class="code">
      <div class="img-wrap"
           w-248-248
           aspectratio>
        <img :src="`${url}${id}`"
             alt=""
             aspectratio-content>
      </div>
    </div>
  </div>
</template>
<script>
import CommonBack from 'common/headerBack/back'
import base from '@/api/base'
export default {
  name: 'mettingLaunch',
  components: {
    CommonBack
  },
  created () {
    this.getDetail()
  },
  data () {
    return {
      title: '会议详情',
      meeting: {},
      url: `${base.pro}/api/meeting/meetingQrcode?user_id=`,
      id: ''
    }
  },
  methods: {
    getDetail () {
      const id = this.$route.params.id
      this.$api.meeting.detail({ id })
        .then(this.getDetailSucc)
        .catch((e) => {
          this.$errorTip()
        })
    },
    getDetailSucc (res) {
      res = res.data
      if (res.code === this.$api.CODE_OK && res.data) {
        const data = res.data
        this.meeting = data.meeting
        this.id = data.user_id
      }
    }
  }
}
</script>
<style lang="stylus" scoped>
@import '~stylus/variable.styl'
@import '~stylus/mixins.styl'

.launch-wrapper
  initPosition()
  overflow-y scroll
  background-color $common_bgc
  z-index 20
  padding()
  padding-top 98px

  .title
    font-size $back_fz
    font-family SourceHanSansCN-Medium
    font-weight 500
    color $order_content
    line-height 40px
    margin-bottom 40px

  .initiator, .coach, .time
    font-size $address
    font-family SourceHanSansCN-Regular
    font-weight 400
    color $order_content
    margin-bottom 30px

  .code
    width 248px
    position absolute
    top 50%
    left 50%
    transform translate(-50%, -50%)
</style>
